<%@ page import="orders.Orders" %>



<div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'buyerName', 'error')} required">
  <label for="buyerName">
    <g:message code="orders.buyerName.label" default="Buyer Name" />
    <span class="required-indicator">*</span>
  </label>
  <g:textField name="buyerName" maxlength="15" required="" value="${ordersInstance?.buyerName}"/>
</div>

<div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'adress', 'error')} ">
  <label for="adress">
    <g:message code="orders.adress.label" default="Adress" />

  </label>
  <g:textField name="adress" value="${ordersInstance?.adress}"/>
</div>
<table border="0" frame="void">
  <tr>
    <td>
      <div style="float:left;padding-right: 15px;">Cherry: </div>
    </td>
    <td>
      <div id="cherryBar_wrapper">
        <div id="cherryBar" class="ui-widget-content"></div>
      </div>
    </td>     
    <td>
      <div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'cherry', 'error')} required">
        <input id="cherry" type="number" name="cherry" value="0"  disabled="disabled">
      </div>
    </td>
  </tr>

  <tr>
    <td>
      <div style="float:left;padding-right: 15px;">Curly Maple: </div>
    </td>
    <td>
      <div id="curlyMapleBar_wrapper">
        <div id="curlyMapleBar" class="ui-widget-content"></div>
      </div>
    </td>
    <td>
      <div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'curlyMaple', 'error')} required">
        <input id="curlyMaple" type="number" name="curlyMaple" value="0" disabled="disabled">
      </div>
    </td>  
  </tr>

  <tr>
    <td>
      <div style="float:left;padding-right: 15px;">Genuine Magohany: </div>
    </td>
    <td>
      <div id="genuineMagohanyBar_wrapper">
        <div id="genuineMagohanyBar" class="ui-widget-content"></div>
      </div>
    </td>
    <td>
      <div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'genuineMagohany', 'error')} required">
        <input id="genuineMagohany" type="number" name="genuineMagohany" value="0" disabled="disabled">
      </div>
    </td>
  </tr>

  <tr>
    <td>
      <div style="float:left;padding-right: 15px;">Wenge: </div>
    </td>
    <td>
      <div id="wengeBar_wrapper">
        <div id="wengeBar" class="ui-widget-content"></div>
      </div>
    </td>
    <td>
      <div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'wenge', 'error')} required">
        <input id="wenge" type="number" name="wenge" value="0" disabled="disabled">
      </div>
    </td>
  </tr>

  <tr>
    <td>
      <div style="float:left;padding-right: 15px;">White Oak: </div>
    </td>
    <td>
      <div id="whiteOakBar_wrapper">
        <div id="whiteOakBar" class="ui-widget-content"></div>
      </div>
    </td>
    <td>
      <div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'whiteOak', 'error')} required">
        <input id="whiteOak" type="number" name="whiteOak" value="0" disabled="disabled">
      </div>
    </td>
  </tr>

  <tr>
    <td>
      <div style="float:left;padding-right: 15px;">Sawdust: </div>
    </td>
    <td>
      <div id="sawdustBar_wrapper">
        <div id="sawdustBar" class="ui-widget-content"></div>
      </div>
    </td>
    <td>
      <div class="fieldcontain ${hasErrors(bean: ordersInstance, field: 'sawdust', 'error')} required">
        <input id="sawdust" type="number" name="sawdust" value="0" disabled="disabled">
      </div>
    </td>
  </tr>
</table>   
<script>
  var cherryFeet=0;
  function getcf()
  {
  return cherryFeet;
  }
  $(function() {
  var $drag_counter = $( "#event-drag" );
  
    $( "#cherryBar" ).draggable({
      drag: function() {
        actualizar( "#event-drag");
      },
    });
    $( "#cherryBar" ).draggable( "option", "containment", "parent" );
    $( "#cherryBar" ).draggable({ axis: "x" });
    function actualizar(event){
      cherryFeet =   Math.round(($( "#cherryBar" ).position().left-$( "#cherryBar_wrapper" ).position().left)*1000/159); 
	 
            $("#cherry").val(cherryFeet);  
         }
  });
</script>

<script>
var cherryFeet=0;
function getcf()
{
return cherryFeet;
}
$(function() {
var $drag_counter = $( "#event-drag" );
  
  $( "#curlyMapleBar" ).draggable({
    drag: function() {
      actualizar( "#event-drag");
    },
  });
  $( "#curlyMapleBar" ).draggable( "option", "containment", "parent" );
  $( "#curlyMapleBar" ).draggable({ axis: "x" });
  function actualizar(event){
    cherryFeet =   Math.round(($( "#curlyMapleBar" ).position().left-$( "#curlyMapleBar_wrapper" ).position().left)*1000/159); 
	 
          $("#curlyMaple").val(cherryFeet);  
       }
});
</script>

<script>
  var cherryFeet=0;
  function getcf()
  {
  return cherryFeet;
  }
  $(function() {
  var $drag_counter = $( "#event-drag" );
  
    $( "#genuineMagohanyBar" ).draggable({
      drag: function() {
        actualizar( "#event-drag");
      },
    });
    $( "#genuineMagohanyBar" ).draggable( "option", "containment", "parent" );
    $( "#genuineMagohanyBar" ).draggable({ axis: "x" });
    function actualizar(event){
      cherryFeet =   Math.round(($( "#genuineMagohanyBar" ).position().left-$( "#genuineMagohanyBar_wrapper" ).position().left)*1000/159); 
	 
            $("#genuineMagohany").val(cherryFeet);  
         }
  });
</script>

<script>
  var cherryFeet=0;
  function getcf()
  {
  return cherryFeet;
  }
  $(function() {
  var $drag_counter = $( "#event-drag" );
  
    $( "#wengeBar" ).draggable({
      drag: function() {
        actualizar( "#event-drag");
      },
    });
    $( "#wengeBar" ).draggable( "option", "containment", "parent" );
    $( "#wengeBar" ).draggable({ axis: "x" });
    function actualizar(event){
      cherryFeet =   Math.round(($( "#wengeBar" ).position().left-$( "#wengeBar_wrapper" ).position().left)*1000/159); 
	 
            $("#wenge").val(cherryFeet);  
         }
  });
</script>

<script>
  var cherryFeet=0;
  function getcf()
  {
  return cherryFeet;
  }
  $(function() {
  var $drag_counter = $( "#event-drag" );
  
    $( "#whiteOakBar" ).draggable({
      drag: function() {
        actualizar( "#event-drag");
      },
    });
    $( "#whiteOakBar" ).draggable( "option", "containment", "parent" );
    $( "#whiteOakBar" ).draggable({ axis: "x" });
    function actualizar(event){
      cherryFeet =   Math.round(($( "#whiteOakBar" ).position().left-$( "#whiteOakBar_wrapper" ).position().left)*1000/159); 
	 
            $("#whiteOak").val(cherryFeet);  
         }
  });
</script>

<script>
  var cherryFeet=0;
  function getcf()
  {
  return cherryFeet;
  }
  $(function() {
  var $drag_counter = $( "#event-drag" );
  
    $( "#sawdustBar" ).draggable({
      drag: function() {
        actualizar( "#event-drag");
      },
    });
    $( "#sawdustBar" ).draggable( "option", "containment", "parent" );
    $( "#sawdustBar" ).draggable({ axis: "x" });
function actualizar(event){
cherryFeet =   Math.round(($( "#sawdustBar" ).position().left-$( "#sawdustBar_wrapper" ).position().left)*1000/159); 

$("#sawdust").val(cherryFeet);  
}
});
</script>